<template>
    <div>
        <detail title="查看订单" :data="data" @close="close"></detail>
+
    </div>
</template>
<script setup lang="ts">
import { ref,h,onMounted, onActivated} from 'vue'
import detail, { type DetailType } from '@/components/myList/detail.vue';

import uploadImg from '@/components/uploadImg.vue'

import { useRouter } from "vue-router"
import { useTabStore } from '@/stores/tab'
import type { Order } from '@/types/Order'


import {useOrderStore} from '@/stores/order'
import type { OrderListRes } from '@/types/OrderListRes';
import { getOrderDetail } from '@/api/orderApi';
const orderStore = useOrderStore()
const tabStore = useTabStore()
const router = useRouter()
const formState = ref<Order>({})
const formRef = ref()

const data = ref<DetailType[]>([])

const close = () => {
    router.back()
    tabStore.removeTab(router.currentRoute.value.fullPath)
}


onMounted(async () => {
    
    let res = await getOrderDetail(orderStore.updateOrder.id!)
    formState.value = res.data

    let imgList:any[] = []
    let content = ''
    for(let goods of formState.value.goodsList!){
        imgList = imgList.concat(goods.imgList)
        content += `${goods.name} : ${goods.num}${goods.unit}；\n `
    }

    data.value = [
        {name: '订单编号', val: formState.value.no},
        {name: '商品', val: content, isTr: true},     
     
        {name: '金额', val: formState.value.amount! / 100 + '元'},  
        {name: '项目', val: formState.value.project?.name },
        {name: '订单介绍', val: formState.value.remark, isTr: true},
        {name: '图片', val: h(uploadImg, {list: imgList, onlyLook: true}), isTr: true, height:120},
    ]
})
</script>
<style scoped>

</style>